<%@page import="java.util.ArrayList"%>
<%@page import="java.util.List"%>
<%@page import="fu.abc.DAO.LocationDAO"%>
<%@page import="fu.abc.model.Location"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<link href="css/style.css" media="screen" rel="stylesheet" type="text/css" />
	<link href="css/infor.css" media="screen" rel="stylesheet" type="text/css" />
	<title>Vnplace.vn</title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<!-- 	<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script> -->
	
	<!-- Add jQuery library -->
	<script type="text/javascript" src="js/jquery-1.10.1.min.js"></script>
	
	<script type="text/javascript" src="js/jquery.fancybox.js?v=2.1.5"></script>
	<link rel="stylesheet" type="text/css" href="css/jquery.fancybox.css?v=2.1.5" media="screen" />

	<link rel="stylesheet" type="text/css" href="css/jquery.fancybox-thumbs.css?v=1.0.7" />
	<script type="text/javascript" src="js/jquery.fancybox-thumbs.js?v=1.0.7"></script>
	
	<script>
	$(document).ready(function(){
	
		// hide #back-top first
		$("#back-top").hide();
		
		// fade in #back-top
		$(function () {
			$(window).scroll(function () {
				if ($(this).scrollTop() > 100) {
					$('#back-top').fadeIn();
				} else {
					$('#back-top').fadeOut();
				}
			});
	
			// scroll body to 0px on click
			$('#back-top a').click(function () {
				$('body,html').animate({
					scrollTop: 0
				}, 800);
				return false;
			});
		});
	
	});
	</script>
<!-- 	google map -->
	<script
		src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">
		</script>
		
		<script>
		
			var latLnglat = document.getElementById("latLnglat");
			var latLnglng = document.getElementById("latLnglng");
			var myCenter=new google.maps.LatLng(latLnglat,latLnglng);
			
			function initialize()
			{
				var mapProp = {
				  center:myCenter,
				  zoom:5,
				  mapTypeId:google.maps.MapTypeId.ROADMAP
				  };
				
				var map=new google.maps.Map(document.getElementById("map-canvas"),mapProp);
				
				var marker=new google.maps.Marker({
				  position:myCenter,
				  });
				
				marker.setMap(map);
				
				var infowindow = new google.maps.InfoWindow({
				  content:"Hello World!"
				  });
				
				google.maps.event.addListener(marker, 'click', function() {
				  infowindow.open(map,marker);
				  });
				}
			
			google.maps.event.addDomListener(window, 'load', initialize);
		</script>

	<script type="text/javascript">
		$(document).ready(function() {

			$('.fancybox').fancybox();

			// Change title type, overlay closing speed
			$(".fancybox-effects-a").fancybox({
				helpers: {
					title : {
						type : 'outside'
					},
					overlay : {
						speedOut : 0
					}
				}
			});

			$('.fancybox-thumbs').fancybox({
				prevEffect : 'none',
				nextEffect : 'none',

				closeBtn  : false,
				arrows    : false,
				nextClick : true,

				helpers : {
					thumbs : {
						width  : 50,
						height : 50
					}
				}
			});
		});
	</script>

	</head>
<body>
	<div id="wrap-container">
		<div id="header-menu">
			<form action="/Vnplace/SearchLocation" method="post">
			<ul id="top-menu">
				<li class="li-brand"><a href="/Vnplace/end-user/homepage.jsp"><img alt=""
						src="image/logo.jpg" width="90px" height="80px;"></a></li>
				
				<li><select class="province" name="province">
						<option value="null" selected="selected">----- Tỉnh -----</option>
						<option value="1">An Giang</option>
						<option value="2">B&#224; Rịa Vũng T&#224;u</option>
						<option value="3">Bắc Giang</option>
						<option value="4">Bắc Kạn</option>
						<option value="5">Bạc Li&#234;u</option>
						<option value="6">Bắc Ninh</option>
						<option value="7">Bến Tre</option>
						<option value="8">B&#236;nh Định</option>
						<option value="9">B&#236;nh Dương</option>
						<option value="10">B&#236;nh Phước</option>
						<option value="11">B&#236;nh Thuận</option>
						<option value="12">C&#224; Mau</option>
						<option value="13">Cần Thơ</option>
						<option value="14">Cao Bằng</option>
						<option value="15">Đ&#224; Nẵng</option>
						<option value="16">Đắk Lắk</option>
						<option value="17">Đăk N&#244;ng</option>
						<option value="18">Điện Bi&#234;n</option>
						<option value="19">Đồng Nai</option>
						<option value="20">Đồng Th&#225;p</option>
						<option value="21">Gia Lai</option>
						<option value="22">H&#224; Giang</option>
						<option value="23">H&#224; Nam</option>
						<option value="24">H&#224; Nội</option>
						<option value="25">H&#224; Tĩnh</option>
						<option value="26">Hải Dương</option>
						<option value="27">Hải Ph&#242;ng</option>
						<option value="28">Hậu Giang</option>
						<option value="29">H&#242;a B&#236;nh</option>
						<option value="30">Hưng Y&#234;n</option>
						<option value="31">Kh&#225;nh H&#242;a</option>
						<option value="32">Ki&#234;n Giang</option>
						<option value="33">Kon Tum</option>
						<option value="34">Lai Ch&#226;u</option>
						<option value="35">L&#226;m Đồng</option>
						<option value="36">Lạng Sơn</option>
						<option value="37">L&#224;o Cai</option>
						<option value="38">Long An</option>
						<option value="39">Nam Định</option>
						<option value="40">Nghệ An</option>
						<option value="41">Ninh B&#236;nh</option>
						<option value="42">Ninh Thuận</option>
						<option value="43">Ph&#250; Thọ</option>
						<option value="44">Ph&#250; Y&#234;n</option>
						<option value="45">Quảng B&#236;nh</option>
						<option value="46">Quảng Nam</option>
						<option value="47">Quảng Ng&#227;i</option>
						<option value="48">Quảng Ninh</option>
						<option value="49">Quảng Trị</option>
						<option value="50">S&#243;c Trăng</option>
						<option value="51">Sơn La</option>
						<option value="52">T&#226;y Ninh</option>
						<option value="53">Th&#225;i B&#236;nh</option>
						<option value="54">Th&#225;i Nguy&#234;n</option>
						<option value="55">Thanh H&#243;a</option>
						<option value="56">Th&#224;nh Phố Hồ Ch&#237; Minh</option>
						<option value="57">Thừa Thi&#234;n Huế</option>
						<option value="58">Tiền Giang</option>
						<option value="59">Tr&#224; Vinh</option>
						<option value="60">Tuy&#234;n Quang</option>
						<option value="61">Vĩnh Long</option>
						<option value="62">Vĩnh Ph&#250;c</option>
						<option value="63">Y&#234;n B&#225;i</option>
				</select></li>
				<li class="li-search">
						<input name="txtsearch" class="txt-search" type="text" placeholder="       Nhập địa điểm cần tìm kiếm...">
						<input type="submit" class="btn" value="Tìm kiếm" />
				</li>
				<li class="li-add"><img src="image/add.png" width="25" height="25"></li>
				<li class="li-2"><a href="/Vnplace/end-user/createlocal.jsp">Tạo địa điểm</a></li>
				<li class="li-3"><a href="/Vnplace/end-user/introduce.jsp">Giới thiệu</a></li>
				<li class="li-4"><a href="/Vnplace/end-user/contact.jsp">Liên hệ</a></li>
			</ul>
			</form>
		</div>
		
		<div id="content">
			<div id="left"></div>
<!-- 			end left -->
			<div id="content-between">
					<%
						int id = Integer.parseInt(request.getParameter("id"));
						Location local = new Location();
						LocationDAO localdao = new LocationDAO();
						local = localdao.getLocalNew(id);
					%>
					
					<input type="text" id="latLnglat" value="<%=local.getLatLnglat()%>">
					<input type="text" id="latLnglng" value="<%=local.getLatLnglng()%>">
					
<!-- 					main content -->
					<div id="main-content">
						<div id="title">
							<b class="b-title"><%=local.getLocationName() %></b>
						</div>
<!-- 						advertise -->
						 <div style='width: 760px; height: 90px; padding-bottom: 15px; margin-left: 15px; margin-top: 5px'>
		                    <script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"> </script>
		                    <ins class="adsbygoogle"
		                         style="display: inline-block; width: 728px; height: 90px"
		                         data-ad-client="ca-pub-1704544291315733"
		                         data-ad-slot="6796263809"></ins>
		                    <script>
		                        (adsbygoogle = window.adsbygoogle || []).push({ });
		                    </script>
		                </div>
						
						<div id="infor-local">
							<div id="address">
								<b>Địa chỉ: </b><label><%=local.getAddressDetail() %></label>
								<input type="hidden" id="address" value="Ba Đình Hà Nội"/>
							</div>
							<div id="phone">
								<b>Nhóm địa điểm: </b><label><%=local.getCategory()%></label>
							</div>
							<div id="phone">
								<b>Số điện thoại: </b><label><%=local.getPhone()%></label>
							</div>
							<div id="website">
								<b>Website: </b><label><a href="<%=local.getWebsite()  %>"><%=local.getWebsite() %></a></label>
							</div>
<!-- 							<b class="map">Chọn vị trí của địa điểm trên bản đồ</b><br /> -->
							<div id="map-canvas"></div>
							
							<div class="fb-like" data-href="/Vnplace/end-user/inforlocal.jsp?id?=<%=id %>" data-layout="button" data-action="like" data-show-faces="true" data-share="true"></div>
							<div id="report-error">
								<a href="reporterror.jsp?id=<%=id %>" class="report-error">[Báo lỗi]</a>
							</div><br/>
							<div id="view-image">
								<b>Hình ảnh: </b>
								<div id="image">
								<p>
								<%
									List<Location> listimage = new ArrayList();
									listimage = localdao.getImageLocation(id);
									for(Location i:listimage){
								%>
									<a class="fancybox" href="<%=i.getLinkimage() %>" data-fancybox-group="gallery">
										<img src="<%=i.getLinkimage() %>" width="100px" height="100px" alt=""/></a>
								<%} %>
								</p>
							</div>
							</div>
							
							<div id="descript">
								<b>Mô tả: </b>
								<hr style="margin-bottom: 15px; margin-top: 15px; width: 720px"/>
									<%=local.getDescript() %>		   
							</div>
							
							<hr style="margin-bottom: 15px; margin-top: 15px; width: 720px"/>
							<div class="fb-comments" data-href="/Vnplace/end-user/inforlocal.jsp" data-width="720px" data-numposts="5" data-colorscheme="light" style="margin-bottom: 15px;"></div>

							<div style="margin-top:15px; margin-bottom:10px">
									<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
									<!-- haivl-under-photo-csi -->
									<ins class="adsbygoogle haivl-under-photo-csi"
										 style="display:inline-block"
										 data-ad-client="ca-pub-1704544291315733"
										 data-ad-slot="5461166606"></ins>
									<script>
									(adsbygoogle = window.adsbygoogle || []).push({});
									</script>
							</div>
							<br/>
						</div>
<!-- 						end infor-local -->
					</div> 
<!-- 					end main-content -->

					<div id="new-location">
							<div id="av">
								<a href="http://www.samsung.com/vn/" target="_blank"><img alt="" src="image/av.png" width="300px" class="aver"> </a>
							</div>
							<div id="local-relate">
								<b class="title">Địa điểm mới</b>
							</div>
							<div id="local">
								<%
									List<Location> lo = new ArrayList();
									LocationDAO lodao = new LocationDAO();
									lo = lodao.listNewLocation();
									for(Location a: lo){
								%>
									<div id="local-detail">
										<a href="/Vnplace/end-user/inforlocal.jsp?id=<%=a.getIdNewLocal() %>" class="a-local"><%=a.getLocationName() %></a>
									</div>
								<%} %>
							</div>
					</div>

				</div>
			<!-- 	end content-between -->
			<div id="right"></div>
			
			<div id="fb-root"></div>
				<script>
					(function(d, s, id) {
						var js, fjs = d.getElementsByTagName(s)[0];
						if (d.getElementById(id))
							return;
						js = d.createElement(s);
						js.id = id;
						js.src = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.0";
						fjs.parentNode.insertBefore(js, fjs);
					}(document, 'script', 'facebook-jssdk'));
				</script>
		
				<!-- 	facebook api for cmt -->
				<div id="fb-root"></div>
					<script>(function(d, s, id) {
					  var js, fjs = d.getElementsByTagName(s)[0];
					  if (d.getElementById(id)) return;
					  js = d.createElement(s); js.id = id;
					  js.src = "//connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v2.0";
					  fjs.parentNode.insertBefore(js, fjs);
					}(document, 'script', 'facebook-jssdk'));</script>
					
							
					<p id="back-top">
						<a href="#top"><span></span></a>
					</p>
		</div><!-- 			end content -->
		<div id="footer">
			<ul id="footer-menu">
				<li><a href="/Vnplace/end-user/homepage.jsp">Trang chủ</a></li>
				<li><a href="/Vnplace/end-user/createlocal.jsp">Tạo địa điểm mới</a></li>
				<li><a href="/Vnplace/end-user/introduce.jsp">Giới thiệu</a></li>
				<li><a href="/Vnplace/end-user/contact.jsp" class="li-3">Liên hệ</a></li>
			</ul>
			<p class="copyright">©Copyright 2014 VnPlace.vn</p>
		</div>
	</div>
<!-- 	end wapper -->
</body>
</html>